:host {
  .profile-back-button {
    margin-top: 5px;
    color: white;
    background: transparent
  }

  .scroll-content {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 80vh;
    --overflow: scroll;

    .login-content {
      width: 86%;

      form.list-form {
        --background: transparent;
        padding: 0;
        margin-bottom: 0;
    
        ion-item {
          --background: transparent;
          --border-color: #000;
          margin: 13px 8px 0 0;
    
          ion-label {
            display: flex;
            align-items: center;
            margin-top: 11px;
            margin-bottom: 10px;
    
            ion-icon {
              display: inline-block;
              font-size: 1.2em;
              margin-right: 8px;
              fill: #000;
            }
          }
        }
      }
    }
  }

  .centro-forms {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index: 1;
  }

  .info-container {
    width: 100%;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
  }


  

  .profile-item {
    padding: 0 16px;
  }

  .profile-fields{
    height: 70%;
    margin-top: 5rem;
  }

  .avatar-container > img {
    border-radius: 50%;
    border: 3px solid white;
  }

  .button-profile {
    padding-top: 15px;
  }
 
  .avatar-container > img {
    border-radius: 50%;
    border: 3px solid black;
  }

  // Menu user profile
  .user-profile {
    .user-avatar {
      width: 68px;
      height: 68px;
      display: inline-block;
      border-radius: 50%;
      box-shadow: inset 0 0 10rem rgba(0, 0, 0, .25), 0 0 4rem rgba(255, 255, 255, .45);
      img {
        border-radius: 50%;
      }
    }
    .toolbar-background {
      background-image: linear-gradient(135deg, var(--ion-color-dark), var(--ion-color-primary));
    }

    .other-data {
      .column {
        &:first-child {
          border-right: 1px solid rgba(36, 50, 157, .25);
        }
      }
    }
  }

  .user-list {
    .item {
      &:last-child {
        border-bottom: 0;
      }
      .item-inner {
        border-color: rgba(0, 0, 0, 0.1);
      }
    }
  }

  .item.item-trasparent {
    background-color: transparent;
    border-color: transparent;
    color: #000;
    bottom: 10px;
  }

  .item-select .label-md {
    color: #000;
  }

  .button-login {
    top: 20px;
    padding-bottom: 25px;
    position: relative;
    z-index: 1;

    ion-button {
      --color: #000;

      ion-icon {
        fill: #000;
      }
    }
  }
}
